<template>
    <div class="calender-task">
        <el-calendar v-model="value" @input="dayClick"></el-calendar>
    </div>

    <el-dialog title="提示" v-model="centerDialogVisible" width="50%" center>
        <!-- <span>每日任务查询</span> -->
        <task-list></task-list>

        <template #footer>
            <span class="dialog-footer">
                <el-button @click="centerDialogVisible = false">取 消</el-button>
                <el-button type="primary" @click="centerDialogVisible = false">确 定</el-button>
            </span>
        </template>
    </el-dialog>
</template>

<script>
import TaskList from "../Common/TaskList";

export default {
    name: "CalenderTask",
    components: {
        TaskList,
    },
    data () {
        return {
            value: new Date(),
            centerDialogVisible: false,
        }
    },
    methods: {
        dayClick (val) {
            // BUG 点击下个月，会触发
            console.log(val);
            this.centerDialogVisible = true;
        }
    }
}
</script>

<style>
</style>